function loadFieldsToPage(wrap, fieldPanel) {

    // private PositionPattern position;

    fieldPanel.find("#fieldName").val(wrap.fieldName);
    fieldPanel.find("h2.fieldNameHeader").html(" <i class='icon-edit'></i> Field Name " + wrap.fieldName);

    fieldPanel.find("#attributeName").val(wrap.tagAttribute);
    loadPositionToPage(wrap.position, fieldPanel);

    if (wrap.multipleResults != fieldPanel.find("#multipleResults").is(":checked")) {
	fieldPanel.find("#multipleResults").click();
    }

    fieldPanel.find("#fieldType").val(wrap.fieldType);
    fieldTypeSelect(fieldPanel.find("#fieldType"));

    if (isNotBlank(wrap.expressions) && wrap.expressions.length > 0) {
	switch (wrap.fieldType) {
	case "Date":
	    fieldPanel.find(".datePattern input").val(wrap.expressions[0].pattern);
	    break;
	case "Custom":
	    fieldPanel.find("#expressionType").val(wrap.expressions[0].expressionType);
	    expressionTypeSelect(fieldPanel.find("#expressionType"));

	    switch (wrap.expressions[0].expressionType) {
	    case "Split":
		fieldPanel.find(".SplitPattern input").val(wrap.expressions[0].pattern);
		break;
	    case "StartWith":
		fieldPanel.find(".StartPattern input").val(wrap.expressions[0].pattern);

		if (fieldPanel.find(".StartInclusive input").is(":checked") !== wrap.expressions[0].inclusive) {
		    fieldPanel.find(".StartInclusive input").click();
		}

		if (wrap.expressions.length > 1) {
		    fieldPanel.find(".StartEnd input").prop("checked", true);
		    fieldPanel.find(".StartEnd input").click();
		    fieldPanel.find(".EndPattern input").val(wrap.expressions[1].pattern);
		    if (fieldPanel.find(".EndInclusive input").is(":checked") !== wrap.expressions[1].inclusive) {
			fieldPanel.find(".EndInclusive input").click();
		    }
		}
		break;
	    case "EndWith":
		fieldPanel.find(".EndPattern input").val(wrap.expressions[0].pattern);

		if (fieldPanel.find(".EndInclusive input").is(":checked") !== wrap.expressions[0].inclusive) {
		    fieldPanel.find(".EndInclusive input").click();
		}

		if (wrap.expressions.length > 1) {
		    fieldPanel.find(".StartEnd input").prop("checked", true);
		    fieldPanel.find(".StartEnd input").click();
		    fieldPanel.find(".StartPattern input").val(wrap.expressions[1].pattern);
		    if (fieldPanel.find(".StartInclusive input").is(":checked") !== wrap.expressions[1].inclusive) {
			fieldPanel.find(".StartInclusive input").click();
		    }
		}
		break;
	    case "RegEx":
		fieldPanel.find(".RegExPattern input").val(wrap.expressions[0].pattern);
		fieldPanel.find(".group input").val(wrap.expressions[0].group);
		break;
	    }
	    break;
	}
    }
}

function loadPositionToPage(pos, fieldPanel) {
    loadTagPatternToPage(pos.localPattern, fieldPanel.find("div[id^='local']"));
    loadTagPatternToPage(pos.parentPattern, fieldPanel.find("div[id^='parent']"));
    loadTagPatternToPage(pos.preSiblingPattern, fieldPanel.find("div[id^='pre-sibling']"));
    loadTagPatternToPage(pos.nextSiblingPattern, fieldPanel.find("div[id^='next-sibling']"));
    loadTagPatternToPage(pos.childPattern, fieldPanel.find("div[id^='child']"));
}

function loadTagPatternToPage(tagPattern, tagPanel) {

    if (isNotBlank(tagPattern)) {
	tagPanel.find("#tagName").val(tagPattern.tagName);
	tagPanel.find("#tagValue").val(tagPattern.tagValue);
	tagPanel.find("#tagExpression").val(tagPattern.tagExpression);

	if (tagPanel.find("#tagRecursive").is(":checked") !== tagPattern.recursive) {
	    tagPanel.find("#tagRecursive").click();
	}

	var tagAttributes = tagPanel.find(".attributePanel");

	if (isNotBlank(tagPattern.attributes) && tagPattern.attributes.length > 0) {
	    $.each(tagPattern.attributes, function(idx, tagAttribute) {
		var tagAttributePanel = createAttributePattern();
		tagAttributePanel.find("#attributeName").val(tagAttribute.attributeName);
		tagAttributePanel.find("#attributeValue").val(tagAttribute.attributeValue);
		tagAttributePanel.find("#attributeExpression").val(tagAttribute.attributeExpression);
		tagAttributes.append(tagAttributePanel);
	    });
	}
    }

    return tagPanel;
}

function extractFields() {
    var w = createEmptyWrapper();

    $("#fields").children().each(function() {
	var field = createEmptyField();
	var fieldPanel = $(this);
	field.fieldName = $(fieldPanel).find("#fieldName").val();
	field.tagAttribute = fieldPanel.find("#attributeName").val();
	field.multipleResults = fieldPanel.find("#multipleResults").is(":checked");
	field.position = extractPosition(fieldPanel);
	field.fieldType = fieldPanel.find("#fieldType").val();
	field.expressions = extractExpression(fieldPanel);

	w.fields.push(field);
    });

    return w;
}

function extractPosition(fieldPanel) {
    var position = createEmptyPosition();

    position.localPattern = extractTag(fieldPanel.find("div[id^='local']"));
    position.parentPattern = extractTag(fieldPanel.find("div[id^='parent']"));
    position.preSiblingPattern = extractTag(fieldPanel.find("div[id^='pre-sibling']"));
    position.nextSiblingPattern = extractTag(fieldPanel.find("div[id^='next-sibling']"));
    position.childPattern = extractTag(fieldPanel.find("div[id^='child']"));

    return position;
}

function extractTag(tagPanel) {
    var tagPattern = createEmptyTag();

    tagPattern.tagName = tagPanel.find("#tagName").val();

    if (isBlank(tagPattern.tagName))
	return null;

    tagPattern.tagValue = tagPanel.find("#tagValue").val();
    tagPattern.tagExpression = tagPanel.find("#tagExpression").val();
    tagPattern.attributes = new Array();
    if (tagPanel.find("#tagRecursive").length > 0) {
	tagPattern.recursive = tagPanel.find("#tagRecursive").is(":checked");
    }

    var tagAttributes = tagPanel.find(".attributePanel .attributePattern");

    tagAttributes.each(function() {
	var tagAttribute = createEmptyAttribute();
	tagAttribute.attributeName = $(this).find("#attributeName").val();
	tagAttribute.attributeValue = $(this).find("#attributeValue").val();
	tagAttribute.attributeExpression = $(this).find("#attributeExpression").val();

	if (isNotBlank(tagAttribute.attributeName)) {
	    tagPattern.attributes.push(tagAttribute);
	}
    });

    return tagPattern;
}

function extractExpression(fieldPanel) {
    var expressions = new Array();

    var fieldTypeCont = fieldPanel.find(".fieldTypeCont");

    if (fieldTypeCont.find(".datePattern").length > 0) {
	var datePatternEx = createEmptyExpression();
	datePatternEx.pattern = fieldTypeCont.find(".datePattern input").val();
	expressions.push(datePatternEx);
    }

    if (fieldTypeCont.find(".SplitPattern").length > 0) {
	var splitPaternEx = createEmptyExpression();
	splitPaternEx.pattern = fieldTypeCont.find(".SplitPattern input").val();
	splitPaternEx.expressionType = "Split";
	expressions.push(splitPaternEx);
    }

    if (fieldTypeCont.find(".StartPattern").length > 0) {
	var startPatternEx = createEmptyExpression();
	startPatternEx.pattern = fieldTypeCont.find(".StartPattern input").val();
	startPatternEx.expressionType = "StartWith";
	startPatternEx.inclusive = fieldTypeCont.find(".StartInclusive input").is(":checked");
	expressions.push(startPatternEx);
    }
    if (fieldTypeCont.find(".EndPattern").length > 0) {
	var endPatternEx = createEmptyExpression();
	endPatternEx.pattern = fieldTypeCont.find(".EndPattern input").val();
	endPatternEx.expressionType = "EndWith";
	endPatternEx.inclusive = fieldTypeCont.find(".EndInclusive input").is(":checked");
	expressions.push(endPatternEx);
    }
    if (fieldTypeCont.find(".RegExPattern").length > 0) {
	var regexPatternEx = createEmptyExpression();
	regexPatternEx.pattern = fieldTypeCont.find(".RegExPattern input").val();
	regexPatternEx.expressionType = "RegEx";
	regexPatternEx.group = fieldTypeCont.find(".group input").val();
	expressions.push(regexPatternEx);
    }

    return expressions;
}
